<template>
    <div>
        <el-row style="margin-top: 30px;">
            <el-col class="title" :span="10" :offset="4"><i class="el-icon-monitor"></i>医院就诊综合系统-注册页面
            </el-col>
        </el-row>
        <el-row style="margin-top: 30px">
            <el-col style="width: 1120px;height: 465px;border: 1px solid black" :offset="4">
                <el-col :span="12">
                    <img :src="url" style="width: 755px;height:463px"/>
                </el-col>
                <el-col :span="12">
                    <el-row>
                        <el-col :offset="10" :span="5">
                            <h3>用户注册</h3>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 15px">
                        <el-col :offset="10" :span="15" style="font-family: 'Microsoft YaHei';font-size:14px;">
                            <h4 style="color: red">请输入姓名或昵称，登录账号由系统为您生成</h4>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 30px">
                        <el-col :span="12" :offset="10">
                            <el-input
                                placeholder="请输入姓名"
                                prefix-icon="el-icon-user"
                                maxlength="8"
                                show-word-limit
                                v-model="username">
                            </el-input>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 30px">
                        <el-col :span="12" :offset="10">
                            <el-input
                                placeholder="请输入密码"
                                prefix-icon="el-icon-lock"
                                maxlength="10"
                                show-password
                                show-word-limit
                                v-model="password">
                            </el-input>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 30px">
                        <el-col :span="12" :offset="10">
                            <el-input
                                placeholder="请再次输入密码"
                                prefix-icon="el-icon-lock"
                                maxlength="10"
                                show-word-limit
                                show-password
                                v-model="requirePassword">
                            </el-input>
                        </el-col>
                    </el-row>
                    <el-row style="margin-top: 30px">
                        <el-col :offset="10" :span="14">
                            请选择身份：
                            <el-select v-model="value" placeholder="请选择" style="width:180px">
                                <el-option
                                    v-for="item in options"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="7" :offset="10" style="margin-top: 30px">
                            <router-link to="1" style="text-decoration: none;color: white">
                                <el-button class="login" type="primary" style="width: 100px">
                                    返回登录
                                </el-button>
                            </router-link>
                        </el-col>
                        <el-col :span="7" style="margin-top: 30px">
                            <el-button type="danger" @click="createCommonRegister">
                                点击注册
                            </el-button>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col>
                            <el-dialog
                                title="请输入管理员密码"
                                :visible.sync="centerDialogVisible"
                                width="30%"
                                :close-on-click-modal="false"
                                center>
                                <span><el-input v-model="adminPassword"/></span>
                                <span slot="footer" class="dialog-footer">
                            <el-button @click="centerDialogVisible=false">取 消</el-button>
                            <el-button type="primary" @click="createAdminAccount">确 定</el-button>
                                </span>
                            </el-dialog>
                        </el-col>
                    </el-row>

                </el-col>
            </el-col>
        </el-row>

    </div>
</template>

<script>

import axios from "axios";

export default {
    name: "AppRegister",
    data() {
        return {
            username: "",
            password: "",
            account: "",
            requirePassword: "",
            url: require('../assets/images/img_3.png'),
            radio: '3',
            centerDialogVisible: false,
            adminPassword: "",
            adminCreateAccountToken: false,
            options: [{
                value: '3',
                label: '患者'
            }, {
                value: '2',
                label: '医生'
            }, {
                value: '1',
                label: '超级管理员'
            }],
            value: '3',
            new1: "123"
        }
    },
    computed: {},
    methods: {
        async createCommonRegister() {
            if (this.username === "" || this.password === "") {
                this.commonFeedBack(101);
                return;
            }
            if (this.requirePassword === "") {
                this.commonFeedBack(102);
                return;
            }
            if (this.requirePassword !== this.password) {
                this.commonFeedBack(103);
                return;
            }
            switch (this.value) {
                case "2":
                case "3": {
                    if (this.password.length < 6) {
                        this.commonFeedBack(6)
                        return;
                    }
                    let that = this;
                    await axios.post("http://localhost:8848/user/registerUser", {
                        username: that.username,
                        password: that.password,
                        roleFlag: that.value,
                    }).then(function (response) {
                            that.account = response.data.data;
                        }
                    );
                    this.$notify({
                        title: "注册成功" + "系统为您分配的账号是：" + this.account,
                        type: "success",
                        duration: 2000
                    })
                    await axios.post("http://localhost:8848/user/findUserByAccount", {
                        account: this.account,
                    }).then(function (response) {
                            that.$store.state.currentUser = response.data.data;
                        }
                    );
                    await this.$router.push({
                        name: "login"
                    });
                    this.$store.state.accountShowOrNot = true;
                    break;
                }
                case "1": {
                    if (this.password.length < 8) {
                        this.commonFeedBack(8);
                        return;
                    }
                    this.centerDialogVisible = true;
                    return;
                }
            }
        },
        async createAdminAccount() {
            if (this.adminPassword === "") {
                alert("请输入管理员密码");
                return;
            }
            let that = this;
            await axios.post("http://localhost:8848/user/getAdminPassword", {
            }).then(function (response) {
                console.log(response)
                    that.$store.state.adminPassword=response.data.data;
                }
            );
            if (this.adminPassword !== this.$store.state.adminPassword) {
                alert("管理员密码错误,请重新输入");
                return;
            }
            await axios.post("http://localhost:8848/user/registerUser", {
                username: that.username,
                password: that.password,
                roleFlag: that.value,
            }).then(function (response) {
                    that.account = response.data.data;
                }
            );
            this.$notify({
                title: "注册成功" + "系统为您分配的账号是：" + this.account,
                type: "success",
                duration: 2000
            })
            await axios.post("http://localhost:8848/user/findUserByAccount", {
                account: this.account,
            }).then(function (response) {
                    that.$store.state.currentUser = response.data.data;
                }
            );
            await this.$router.push({
                name: "login"
            });
            this.$store.state.accountShowOrNot = true;
        },
        commonFeedBack(data) {
            console.log("data数据")
            console.log(data)
            switch (data) {
                case 101: {
                    this.$message({
                        message: "请输入用户名和密码！",
                        type: "error",
                        duration: 2000
                    })
                    break;
                }
                case 102: {
                    this.$message({
                        message: "请再次输入密码！",
                        type: "error",
                        duration: 2000
                    })
                    break;
                }
                case 103: {
                    this.$message({
                        message: "两次密码输入不一致",
                        type: "error",
                        duration: 2000
                    })
                    break;
                }

                case 6: {
                    this.$message({
                        message: "密码太简单啦！最少设置6位数密码",
                        type: "error",
                        duration: 2000
                    })
                    break;
                }
                case 8: {
                    this.$message({
                        message: "密码太简单啦！最少设置8位数密码",
                        type: "error",
                        duration: 2000
                    })
                    break;
                }
            }

        }
    }
}
</script>

<style scoped>
.title {
    font: normal 24px/45px "microsoft YaHei";
    color: #1069a4;
    padding: 0;

}

/**{*/
/*    background-image: url('../assets/images/background.jpg');*/
/*}*/
</style>
